By seboj on

This is my first time building a website, and therefore, my first time using Drupal. It's for my fiancee's photography business. I was wanting to embed an interactive flash gallery http://www.airtightinteractive.com/projects/tiltviewer/examples/tiltview... onto the front page. I uploaded it to the webserver, but cannot seem to make it work.

Is it possible to call a flash object using html in content (page / story)? I was attempting to use the code they provided, with the input format set to full html, but whenever I path to the object, it doesn't work.

If I posted this in the wrong section, or if there's already a detailed tutorial on the subject, please point me to it. Thanks!

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>TiltViewer HTML Embed Example</title>
<script type="text/javascript" src="tiltviewer/swfobject.js"></script>
<style type="text/css">	
	body {
		background-color: #ffffff;
		font: .8em/1.3em verdana,arial,helvetica,sans-serif;
		width: 800px;		
	}
	
	#flashcontent {
		width: 100%;
		height: 640px;
		border: thin #999999 solid;		
		background-color: #000000;
	}
		
</style>
</head>
<body>	

	<script type="text/javascript">
	
		var fo = new SWFObject("tiltviewer/TiltViewer.swf", "viewer", "100%", "100%", "9.0.28", "#000000");			
		
		// TILTVIEWER CONFIGURATION OPTIONS
		// To use an option, uncomment it by removing the "//" at the start of the line
		// For a description of config options, go to: 
		// http://www.airtightinteractive.com/projects/tiltviewer/config_options.html
															
		//FLICKR GALLERY OPTIONS
		// To use images from Flickr, uncomment this block
		//fo.addVariable("useFlickr", "true");
		//fo.addVariable("user_id", "48508968@N00");
		//fo.addVariable("tags", "jump,smile");
		//fo.addVariable("tag_mode", "all");
		//fo.addVariable("showTakenByText", "true");			
		
		// XML GALLERY OPTIONS
		// To use local images defined in an XML document, use this block		
		fo.addVariable("useFlickr", "false");
		fo.addVariable("xmlURL", "gallery.xml");
		fo.addVariable("maxJPGSize","640");
		
		//GENERAL OPTIONS		
		fo.addVariable("useReloadButton", "false");
		fo.addVariable("columns", "3");
		fo.addVariable("rows", "3");
		//fo.addVariable("bkgndInnerColor", "0xFFFFFF");
		//fo.addVariable("bkgndOuterColor", "0xFFFFFF");				
		//fo.addVariable("frameColor", "0xAAAAAA");
		//fo.addVariable("navButtonColor", "0x000000");
		//fo.addVariable("showFlipButton", "true");
		fo.addVariable("showLinkButton", "false");
		//fo.addVariable("linkLabel", "View image info");
		//fo.addVariable("backColor", "0xDDDDDD");
		//fo.addVariable("langGoFull", "Go Fullscreen");
		//fo.addVariable("langExitFull", "Exit Fullscreen");
		//fo.addVariable("langAbout", "About");				
				
		// END TILTVIEWER CONFIGURATION OPTIONS
		
		fo.addParam("allowFullScreen","true");
		fo.write("flashcontent");			
	</script>			
		
	</script>	

</body>
</html>

These are the two places where I set the paths:

<script type="text/javascript" src="tiltviewer/swfobject.js"></script>
var fo = new SWFObject("tiltviewer/TiltViewer.swf", "viewer", "100%", "100%", "9.0.28", "#000000");

Have I missed a place, or was it done wrong?

⋅ Categories: Drupal 6.x

Comments

grobemo’s picture

grobemo commented

Yes, it is possible to embed Flash in Drupal content. What do you see when you try to load this page?

seboj’s picture

seboj commented

www.parhelionphoto.com

It doesn't show up, but it does -something-, because the content shows the "read more" button.

vm’s picture

vm commented

part of the problem is that you don't need all that HTML.

drupal already provides open and close HTML tags and body tabs and head tags.

_____________________________________________________________________
My posts & comments are usually dripping with sarcasm.
If you ask nicely I'll give you a towel : )

seboj’s picture

seboj commented

I removed all the tags except for the script tags, but still get the same result. It's good to know that I don't need them, however.

seboj’s picture

seboj commented

No suggestions? Anybody?

grobemo’s picture

grobemo commented

What path are you using to point to the script and .swf file? And where are those files saved in your Drupal installation?

seboj’s picture

seboj commented

Drupal is installed in root. The paths I'm using are

tiltviewer/tiltviewer.swf
tiltviewer/swfobject.js
tiltviewer/gallery.xml

I know the paths work, because I can post flash movies using simple code:

<object width="550" height="400">
<param name="movie" value="somefilename.swf">
<embed src="somefilename.swf" width="550" height="400">
</embed>
</object>

I also tried to post this "polaroid" gallery http://www.no3dfx.com/polaroid/ and I could get it to come up, but it didn't call the .xml file, so no pictures are placed in it. Is there something in Drupal that I'm missing, that prevents the flash from calling the outside resources, or am I just doing something stupid?

ludo1960’s picture

ludo1960 commented

Why not use the flashnode module? Works just fine for including flash movies!

seboj’s picture

seboj commented

I skipped over it originally, thinking I needed SWF Tools for the js support, which hasn't been updated to 6.x yet.

Fortunately, I gave it a look after your suggestion, and it works perfectly!

I can't tell you how grateful I am, this has been eating at me for days.

Thanks!

ludo1960’s picture

ludo1960 commented

I'm happy your problems are solved, communication is a great thing!

zfanatic’s picture

zfanatic commented

how do you pass the xml to the polaroid.swf node?

seboj’s picture

seboj commented

I uploaded the files to the server, then uploaded the swf using flashnode. In the advanced parameters for the flashnode post, I had to set the "base" to where I had my files stored - in my case, it was /sites/default/files/flash/polaroid.

titaniumtommy’s picture

titaniumtommy commented

I've tried the flashnode method to get tiltviewer working and it seems to be working properly however, when I load the tiltviewer page, the squares populate then they all fade away. What gives?

Here's the page: http://xiaodavinci.com/1/node/3

I set the base to be this /1/gallery/hy which has the xml file as well as the images and thumbnails as generated by picasa. I've tried to edit the gallery.xml to make the imageurls be relative to /1/gallery/hy (so just "images/image1.jpg") or full path like "http://www.xiaodavinci.com/1/gallery/hy/images/image1.jpg. Neither of these work and I still get the squares fading away. Any ideas?

teach42’s picture

teach42 commented

I had the exact same problem, and it turned out that for some reason the FlashVars field was having its text converted by drupal. So things like quotation marks were being converted to " and such. This was making the Flashvars invalid. Even after turning off TinyMCE and making sure Full HTML was selected, the text was still being converted. I never did figure out why, but a friend did help me figure out how pass the text in a way that FlashNode would accept it.

If you take each of the variables available, and just pass the ones that you want active, you should be golden. Just put in the parameter=option and then join them all with &&

So instead of
fo.addVariable("columns", "3");
fo.addVariable("rows", "3");
fo.addVariable("showFlipButton", "true");

I put the following into the FlashVars textbox
columns=3&&rows=3&&showFlipbutton=true

Need more options? Just keep stringing them together with &&

That's it. Left the body empty and such. Didn't need to upload any other TiltViewer files or anything since i was using Flickr anyway.

Working now and happy for it.

novovox’s picture

novovox commented

I have tried using flashnode to show the Tiltviewer. I have Tiltviewer.swf ok and display what I assume are the default Flickr images. I cannot bring in the fo variables in the index.html file to override the default in the .swf file. These are the basic settings I need to have image from my local gallery appear.

fo.addVariable("useFlickr", "false");
fo.addVariable("xmlURL", "gallery.xml");
fo.addVariable("maxJPGSize","1024");

I'm guessing its something to do with my paths but I've tried all sorts of combinations without success. Does anyone have any suggestions for solving this?

jacopo3001’s picture

jacopo3001 commented

i placed both my js and swf on root folder.

if i load a page using a alt path such as 'site.com/news', file will load correctly
if i used drupal's natural path (site.com/node/15), JS are loaded correctly, but SWF area is empty (movie not loaded)

i guess that JS cannot find the swf, as the path is different.

how to control this??

karl2011’s picture

karl2011 commented

if you are using swftools you can use the changed simpleviewer modul to get tiltviewer access

#669760: TiltViewer